<seed-content class="gray-background">
  <div class="toolbar" [class.show]="stateStore.showMenu">
    <div class="title-bar  seed-underline seed-flexbox seed-flexbox-align-center">
      <div class="toolbar-title">{{testInfo['testModeName']}}成绩录入</div>
      <i class="toggle-icon seed-icon" (click)="stateStore.showMenu=!stateStore.showMenu"></i>
    </div>
    <seed-toolbar-nav></seed-toolbar-nav>
  </div>

  <div class="score-input">
    <header *ngIf="studentInfo">
      <div class="info-wrap seed-underline seed-flexbox">
        <p class="avatar">
          <!--<seed-avatar [lazyLoadAvatar]="studentInfo.headPicture"></seed-avatar>-->
          <img [src]="studentInfo.headPicture||dataStore.defaultAvatar " alt="">
        </p>
        <div class="basic-info">
          <span class="nick">{{studentInfo.name}}</span>
          <div class="body-info seed-flexbox seed-flexbox-content-between">
            <p *ngIf="studentInfo.age">
              <span>{{studentInfo.age}}</span>
              <em>年龄</em>
            </p>
            <p *ngIf="studentInfo.height">
              <span>{{studentInfo.height}}cm</span>
              <em>身高</em>
            </p>
            <p *ngIf="studentInfo.weight">
              <span>{{studentInfo.weight}}kg</span>
              <em>体重</em>
            </p>
          </div>
        </div>
      </div>
      <div class="test-content-select seed-flexbox seed-flexbox-align-center"
           [class.seed-right-arrow]="dataStore.testTypeId==0">
        {{testInfo['testMethodName']}} ({{studentInfo.testAgeName}})
        <input type="number" [(ngModel)]="testInfo['testScore']" [value]="testInfo['testScore']" placeholder="请输入成绩"
               *ngIf="dataStore.testTypeId==1">

        <select [ngModel]="paramStore.testScore" (ngModelChange)="handleGradeOptionChange($event)"
                *ngIf="dataStore.testTypeId==0">
          <option *ngFor="let option of gradeList; let i =index" [value]="option.maxValue"
                  [selected]="option.maxValue===testInfo['testScore']">
            {{option.testGrade}}
          </option>
        </select>
      </div>
    </header>

    <div class="content" *ngIf="testScoreOptions.length>0">
      <h2 class="seed-flexbox seed-flexbox-align-center  gray-background">额外加减分项</h2>
      <div class="add-sub-score">
        <div class="item seed-flexbox seed-flexbox-align-center seed-flexbox-content-between"
             *ngFor="let option of testScoreOptions">
          <p>{{option.testDetail}} </p>
          <p class="seed-flexbox seed-flexbox-align-center">
            <span class="score-text">{{option.score}}{{option.unit}}</span>
            <!--<input type="checkbox" (ngModelChange)="scoreOptionChange($event)">-->
            <i class="checkbox seed-flexbox seed-flexbox-align-center seed-flexbox-content-center"
               [class.checked]="option.flag" (click)="handleScoreOptionChange(option)"></i>
          </p>
        </div>
      </div>
    </div>
  </div>
</seed-content>

<footer class="bottom-btn-wrap seed-border-top">
  <button class=" btn left-btn" (click)="goToScoreCriteriaPage()" *ngIf="dataStore.testTypeId==1">查看评分标准</button>
  <button type="submit" class="btn right-btn" [disabled]="!testInfo['testScore']" (click)="postStudentTestScore()">
    {{dataStore.saveBtnText}}
  </button>
</footer>
<!--*ngIf="dataStore.testTypeId==1"-->
